<template>
	<view class="content">
		<view class="head">

			<view class="">
				<text>真实姓名</text>
				<input type="text" v-model="username" maxlength="8" placeholder="请输入姓名" />
			</view>
			<view class="">
				<text>身份证号</text>
				<input type="idcard" v-model="num" placeholder="请输入身份证号" />
			</view>
			<view class="">
				<text>手机号</text>
				<input type="number" v-model="mobile" maxlength="11" placeholder="请输入手机号" />
			</view>
			<view class="">
				<text>性别</text>
				<u-radio-group v-model="radiovalue1" activeColor="#22B591" placement="row">
					<u-radio
					      :customStyle="{marginRight:'80rpx'}"
					      v-for="(item, index) in radiolist1"
					      :key="index"
					      :label="item.name"
					      :name="item.name"
					      @change="radioChange"
					>
					</u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="btn" @click="submit">立即申请</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: '', //姓名
				num: '', //身份证号
				mobile: '', //手机号
				sex: '', //性别
				type: 1, //1.申请美食官
				radiolist1: [{
						name: '男',
						disabled: false
					},
					{
						name: '女',
						disabled: false
					}
				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				radiovalue1: '男',
			}
		},
		onLoad(e) {
			this.type = e.type ;
			if (this.type == 1) {
				uni.setNavigationBarTitle({
					title: '申请成为美食官'
				})
			}else if (this.type == 2) {
				uni.setNavigationBarTitle({
					title: '申请成为买手'
				})
			}else if (this.type == 3) {
				uni.setNavigationBarTitle({
					title: '申请成为骑手'
				})
			}
		},
		onShow() {},
		methods: {
			radioChange(n) {
				console.log('radioChange', n);
				if(n=='男'){
					this.sex=1
				}else{
					this.sex=2
				}
			},
			submit() {
				if(this.type!=1){
					if (!this.username) {
						uni.showToast({
							title: "请输入姓名",
							icon: "none"
						})
						return
					}
					// if(!this.$checkStr(this.username,'chinese')){
					// 	uni.showToast({
					// 		title: "姓名格式错误！",
					// 		icon: "none"
					// 	})
					// 	return
					// }
					if (!this.num) {
						uni.showToast({
							title: "请输入身份证号",
							icon: "none"
						})
						return
					}
					if(!this.$checkStr(this.num,'card')){
						uni.showToast({
							title: "身份证号格式错误！",
							icon: "none"
						})
						return
					}
					if (!this.mobile) {
						uni.showToast({
							title: "请输入手机号",
							icon: "none"
						})
						return
					}
					if(!this.$checkStr(this.mobile,'mobile')){
						uni.showToast({
							title: "手机号格式错误！",
							icon: "none"
						})
						return
					}
				}
			
				
				if(this.type==1){
					// 1 为申请美食官
					let data = {
						real_name: this.username,
						id_card: this.num,
						phone: this.mobile,
						sex: this.radiovalue1 == '男' ? '1' : '2'
					}
					uni.showLoading({
						mask:true
					})
					this.$request('user/apply/spreadGradeRaise',data).then(res=>{
						if(res.status==200){
							uni.showToast({
								title:"提交成功"
							})
							setTimeout(function(){
								uni.navigateBack({
									delta:2
								})
							},1000)
						}
							
					})
					
					
				}else{
					//  1， 2 为申请买手
					
					let data = {
						real_name: this.username,
						id_card: this.num,
						phone: this.mobile,
						sex: this.radiovalue1 == '男' ? '1' : '2',
						type:(this.type*1-1)
					}
					uni.showLoading({
						mask:true
					})
					this.$request('user/application',data).then(res=>{
						if(res.status==200){
							uni.showToast({
								title:"提交成功"
							})
							setTimeout(function(){
								uni.navigateBack({
									
								})
							},1000)
						}
							
					})
				}
				

		
				
				
				
				
				// uni.showLoading({
				// 	mask: true
				// })
			},
		}
	}
</script>

<style>
	.content {
		padding-bottom: 100rpx;
		overflow: hidden;
	}

	.head {
		padding: 0 30rpx;
	}

	.head>view {
		display: flex;
		align-items: center;
		padding: 46rpx 0;
		border-bottom: 1rpx solid #eee;
	}

	.head>view>text {
		display: inline-block;
		width: 200rpx;
	}

	.area image {
		width: 12rpx;
		height: 24rpx;
		margin-left: 20rpx;
	}

	.head>view input {
		font-size: 28rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		margin: 0;
		padding: 0;
	}

	.btn {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 750rpx;
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
		color: #fff;
		font-size: 32rpx;
		background: linear-gradient(64deg, #2BCCA5, #22B591);
	}
</style>
